<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>修改密码</title>

<link rel="stylesheet" type="text/css" href="css/common.css">
<link rel="stylesheet" href="dist/css/bootstrap.css">
<link rel="stylesheet" href="dist/css/font-awesome-4.4.0/font-awesome.min.css">
<link rel="stylesheet" href="css/AdminLTE.css">
</head>
<body class="login-page">
	<div class="login-box">
		<div class="loginlogo">
			<i class="fa fa-book"></i>
		</div>
		<div class="login-box-body">
			<p class="login-box-msg login-maintext">学生选课系统</p>
			<form method="post" class="loginform">
				<div class="form-group has-feedback" style="height:30px;">
					<span id="freediv" style="display:none;">123</span>					
				</div>
				<div class="form-group has-feedback">
					<input id="loadno" type="text" class="form-control login-inputtext" placeholder="学号">
					<i class="fa fa-user form-control-feedback loginfa"></i>
				</div>
				<div class="form-group has-feedback">
					<input id="oldpassword" type="password" class="form-control login-inputtext" placeholder="原始密码"> 
					<i class="fa fa-lock form-control-feedback loginfa"></i>
				</div>
				<div class="form-group has-feedback">
					<input id="newpassword1" type="password" class="form-control login-inputtext" placeholder="新密码"> 
					<i class="fa fa-lock form-control-feedback loginfa"></i>
				</div>
				<div class="form-group has-feedback">
					<input id="newpassword2" type="password" class="form-control login-inputtext" placeholder="请再输入新密码"> 
					<i class="fa fa-lock form-control-feedback loginfa"></i>
				</div>
				<div class="row">					
					<div class="col-xs-12">
						<input id="chan" type="button" value="保	存" onClick="changePass()" 
							class="btn btn-primary btn-block btn-flat loginbutton">
					</div>
				</div>
				<div align="center" style="margin-top:5px;">
					<a href="login">返回登录</a>
				</div>
			</form>
		</div>
	</div>
	
	<script src="js/app.js"></script>
	<script src="dist/js/jquery-2.2.3.min.js"></script>
	<script src="dist/js/bootstrap.js"></script>	
	
	<script type="text/javascript">	
	function faildInfo() {
		$("#freediv").fadeOut(2000);
	}

	function changePass() {			
		if(testno && testoldpass && testnewpass1 && testnewpass2) {			
			$.ajax({
				url:'/ui/updatepassword',
				data:{
					loadno : $("#loadno").val(),
					oldpassword : $("#oldpassword").val(),
					newpassword : $("#newpassword1").val()
				},
				type:'POST',
				dataType:"text",
				success : function(data) {
					if(data.indexOf("y")>=0) {
						alert("密码修改通过,将跳转到登录界面");
						window.location.href = "login";
					} else {
						$("#freediv").css("color","#d73925");
						$("#freediv").html("<i class='fa fa-close'></i> "+data);
						$("#freediv").show();
						setTimeout(freeOut,1000);
					}
				},
				error : function() {
					$("#freediv").css("color","#d73925");
					$("#freediv").html("<i class='fa fa-close'></i> 系统错误,请重试");
					$("#freediv").show();
					setTimeout(freeOut,1000);
				}
			});				
		}
	}	
	
	//对登录账号进行验证
	var testno = false;
	$("#loadno").blur(function() {			
		var loadno = $("#loadno").val();
		if(loadno == "") {
			$("#freediv").css("color","#d73925");
			$("#freediv").html("<i class='fa fa-close'></i> 学号不能为空");
			$("#freediv").show();
			setTimeout(freeOut,1000);
			testno = false;
		} else {
			testno = true;
		} 
	});			
	
	//对原始密码的验证
	var testoldpass = false;
	$("#oldpassword").blur(function() {
		var oldpass = $("#oldpassword").val();
		if (oldpass == "") {
			$("#freediv").css("color","#d73925");
			$("#freediv").html("<i class='fa fa-close'></i> 密码不能为空");
			$("#freediv").show();
			setTimeout(freeOut,1000);
			testoldpass = false;
		} else {
			testoldpass = true;
		}
	});			
	
	//新密码的检查
	var testnewpass1 = false;
	$("#newpassword1").blur(function() {			
		var newpass = $("#newpassword1").val();
		var regt = /^[0-9]*$/;
		if(newpass == "") {
			$("#freediv").css("color","#d73925");
			$("#freediv").html("<i class='icon fa fa-close'></i> 新密码不能为空");
			$("#freediv").show();
			setTimeout(faildInfo, 1000);
			testnewpass1 = false;
		} else if( newpass.length != 6 || !regt.test(newpass)) {
			$("#freediv").css("color","#d73925");
			$("#freediv").html("<i class='icon fa fa-close'></i> 新密码由6位数字组成");
			$("#freediv").show();
			setTimeout(faildInfo, 1000);
			testnewpass1 = false;
		} else {
			$("#freediv").css("color","#2BA315");
			$("#freediv").html("<i class='icon fa fa-check'></i> 新密码验证通过");
			$("#freediv").show();
			setTimeout(faildInfo, 1000);
			testnewpass1 = true;
		}
	});
	
	//确认密码的检查
	var testnewpass2 = false;
	$("#newpassword2").blur(function() {				
		var confirmnewpass = $("#newpassword2").val().trim();
		var newpass = $("#newpassword1").val().trim();
		if (confirmnewpass == "") {
			$("#freediv").css("color","#d73925");
			$("#freediv").html("<i class='icon fa fa-close'></i> 确认密码不能为空");
			$("#freediv").show();
			setTimeout(faildInfo, 1000);
			testnewpass2 = false;
		} else if (newpass != confirmnewpass) {
			$("#freediv").css("color","#d73925");
			$("#freediv").html("<i class='icon fa fa-close'></i> 两次密码不匹配,请重新输入");
			$("#freediv").show();
			setTimeout(faildInfo, 1000);
			testnewpass2 = false;
		} else {
			$("#freediv").css("color","#2BA315");
			$("#freediv").html("<i class='icon fa fa-check'></i> 两次密码匹配成功,请点击保存");
			$("#freediv").show();
			setTimeout(faildInfo, 1000);
			testnewpass2 = true;
		}
	});
	</script>
</body>
</html>